import React from 'react';
import { Input } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import './SearchInput.css';  // 同级导入

const { Search } = Input;

interface SearchInputProps {
  placeholder?: string;
  onSearch: (value: string) => void;
  className?: string;
  style?: React.CSSProperties;
}

export const SearchInput: React.FC<SearchInputProps> = ({
  placeholder = "搜索...",
  onSearch,
  style
}) => {
  return (
    <Search
      placeholder={placeholder}
      onSearch={onSearch}
      enterButton={
        <div>
          <SearchOutlined />
          搜索
        </div>
      }

      style={style}
    />
  );
};